import React from 'react'
/**
 * 类别：组件
 * 功能：按钮组
 * 示例：
 */
class BtnGroup extends React.Component <IChildProps,void>{
    constructor(props, context) {
        super(props, context);
        this.state = {
            value : this.props.value,
            BtnList : this.props.BtnList
        }
        this.handlClick = this.handlClick.bind(this)
    }
    handlClick (value){
        if (value != this.state.value && this.props.onChange) {
            this.props.onChange(value);
        }
    }
    componentWillReceiveProps(nextProps){
        this.setState({
            value : nextProps.value,
            BtnList : nextProps.BtnList
        })
    }
    render() {
        return (
            <span className={this.props.className}>
                {
                    this.state.BtnList.map( (btn,index) =>{
                        return <button key={index} className={this.state.value  == btn.value ? "bill-btn-active" :"bill-btn"} onClick={this.handlClick.bind(this,btn.value)}>{btn.title}</button>
                    })
                }
                
                
            </span>
            )
    }
}

export default BtnGroup